<template>
  <div>
denglu
  </div>
</template>

<style></style><template>

  <div class="login-page">
    <div style="margin:0 auto;text-align:center;margin-top:50px;">
      <h1>登-录</h1>
    </div>
    <p><el-input maxlength="11" v-model="account" placeholder="请输入账号"></el-input></p>
    <p><el-input placeholder="请输入密码" v-model="password" show-password></el-input></p>
    <p style="text-align:center"><el-button type="primary" @click="handleLogin" plain>登录</el-button></p>
  </div>

</template>

<script>
import axios from 'axios'

// 假设在 LoginPage.vue文件中


export default {
  name: 'LoginPage',
  data() {
    return {
      account: '1',
      password: '1',

    }
  },
  methods: {
    handleLogin() {


      axios.post('http://localhost:56051/api/Login/Logins', {
        account: this.account,
        password: this.password
      }).then(res => {
        if(res.data.code==0){
          this.$router.push("homepage")
        }else{
          alert("主播是乐子")
        }
      }).catch(err=>{
        alert(err)
      })


      


    }
  }

}


</script>
<style>
.login-page {
  width: 30%;
  height: 30%;
  background-color: rgba(255, 255, 255, 0.5);
  /* 设置半透明白色背景 */
  backdrop-filter: blur(5px);
  /* 对背景应用5px的模糊效果 */
  border: 1px solid gray;
  margin: 50px auto;
  border-radius: 10px;
}

h1 {
  color: rgb(255, 255, 255);
}

p {
  margin-top: 50px;
  padding-left: 20px;
  padding-right: 20px;
}

body {
  margin: 0px;
  padding: 0px;
  width: 100%;
  height: 100%;
  background-size: cover;

}
</style>